<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/afterDlZc.css" />
		<link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
	</head>

	<body>

		<header class="mui-bar mui-bar-nav">
			<a class="mui-pull-left" id="fanhui">
				<span class="mui-icon iconfont icon-icon"></span>
			</a>
			<h1 class="mui-title mui-text-left">个人信息</h1>
			<a class="mui-icon mui-pull-right" id="queren">确认</a>
		</header>
		<div class="geren">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						
						<!--<img class="mui-media-object mui-pull-left" src="../images/yuan2.jpg">-->
						<!--<span class="bjtx">编辑头像</span>-->
						
						<!--//上传头像-->
						<form action="shangchuan.php" method="post" enctype="multipart/form-data">
							<label for="avatar-upload" style="cursor:pointer;">
								<img src="../images/yuan2.jpg" alt="" class="mui-media-object mui-pull-left img-responsive">
								<span class="bjtx">编辑头像</span>
							</label>
							<input type="file" name="files" style="display:none;" id="avatar-upload">
						</form>

					</a>
				</li>
			</ul>
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>昵称：</label>
					<input type="text" class="mui-input-clear" placeholder="请输入昵称" id="nicheng">
				</div>
			</form>
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>性别：</label>
					<input type="text" class="mui-input-clear" placeholder="请输入性别" id="sex">
				</div>
			</form>
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>用户ID：</label>
					<p class="mui-input-clear" id="yonghuID" style="font-size: 20px;margin-top: 8px;"></p>
				</div>
			</form>
			<form class="mui-input-group">
				<br />
				<label>自我介绍：</label>
				<textarea class="jieshao" id="ziwoJS"></textarea>

			</form>
		</div>

	</body>
	<script src="../js/mui.min.js"></script>
	<script type="text/javascript">
		mui.init();
		window.onload = function() {
			window.addEventListener('userXinxi', function(event) {
				console.log(event.detail.name);
				var yonghuID = event.detail.name;
				
				console.log(yonghuID);
				console.log(localStorage.getItem(name));
				
				document.getElementById("yonghuID").innerText = yonghuID;
				var nicheng = document.getElementById("nicheng").value;
				var sex = document.getElementById("sex").value;
				var ziwoJS = document.getElementById("ziwoJS").value;
				
				////////////////////////////////////////图片上传
				document.getElementById("queren").addEventListener('tap',function(){

					document.getElementById("avatar-upload").change(function() {
	              
			            var formData = new FormData(document.getElementsByTagName('form')[0]);
			
			            //如何获取 文件选择框，选中的文件？？？？
			
			            var select_file = document.getElementById("avatar-upload")[0].files[0];
			            console.log(sex);
			            
			            formData.append('file', select_file); //我们已经准备好了，往后台传递文件了
						
						//////////////////////////////////
							mui.ajax('http://10.2.43.24/APP/QiJiaVIDEOS/PHP/userXinXi.php', {
						        data: {
						            pic: formData,       
									nicheng: nicheng,
									sex: sex,
									ziwoJS:ziwoJS,
									yonghuID:yonghuID
						        },
						        type: 'post',
						        timeout: 10000,
						        dataType: 'json',
						        success: function(data) {
						            if(data.error == 0) {   
						                mui.toast('上传成功');  
						            } else {
						                mui.toast('上传失败:'+data.data);
						            }
						        },
						        error: function(xhr, type, errorThrown) {
						            mui.toast('错误');
						        }
						    });
	
						//////////////////////////////////
			        })
				});
				//////////////////////////////////////////////////////////////////////

			});

			//返回个人中心
			document.getElementById("fanhui").addEventListener('tap', function() {
				mui.openWindow({
					url: './gerenZX.html'
				});
			});

		}
	</script>

</html>